<template>
	<ContentWrap>
		<template #header>
			<el-space wrap>
				<mdp-hi-query :column-configs="columnConfigs" v-model="hiQueryParams" @change="onHiQueryParamsChange"/>
          <el-button icon="zoom-out" @click="searchReset()" title="重置查询条件并查询"/>
          
          <span v-if="currOpType=='mng'">
              <el-button :disabled="disBtn('addBtn') || !checkBtnQx('addBtn',menuDefId) " type="primary" @click="showAdd" icon="plus" plain/>
              <el-button :disabled="disBtn('delBtn') || !checkBtnQx('delBtn',menuDefId) || sels.length===0 || load.del==true" type="danger" v-loading="load.del" @click="batchDel" icon="delete" plain/>
          </span> 
          
          <el-button icon="download" @click="export2Excel()" title="导出当前结果数据"/>
          <mdp-table-configs :column-configs="columnConfigs" v-model="checkedColumns"/>

			</el-space>

		</template>
		<el-space>
			<MdpSelect  v-if="!simple" itemCode="objType" v-model="filters.objType"/>
			<el-input v-model="filters.key" style="width: 20%;" placeholder="模糊查询"/>
 			<el-button type="primary" v-loading="load.list" :disabled="load.list==true" @click="searchTableDatas">查询</el-button>
		</el-space>
		
	</ContentWrap> 
			<!--列表 XmRecord xm_record-->
			<el-table ref="table" v-adaptive="{bottom:50}" :data="tableDatas" @sort-change="sortChange" highlight-current-row v-loading="load.list" border @selection-change="selsChange" @row-click="rowClick" style="width: 100%;">
				<el-table-column sortable type="index" width="40" />
				<el-table-column prop="projectId" label="项目/产品" v-if="!simple" min-width="80" >
					<template #default="scope">
						{{scope.row.productId?scope.row.productId:scope.row.projectId}}
					</template>
				</el-table-column>
				<el-table-column prop="bizId" label="对象主键" v-if="!simple" min-width="80" show-overflow-tooltip  />
				<el-table-column prop="action" label="操作" min-width="80" />
				<el-table-column prop="operUsername" label="操作人名字" min-width="80"  />
				<el-table-column prop="operTime" label="操作时间" min-width="80"  />
				<el-table-column prop="objType" label="对象类型" min-width="80">
					<template #default="scope">
						<MdpSelect v-model="scope.row.objType" itemCode="objType" :disabled="true" showStyle="tag"/>
					</template>
					</el-table-column>
				<el-table-column prop="ip" label="ip" min-width="80" />
				<el-table-column prop="reqNo" label="请求号" min-width="80"  show-overflow-tooltip />
				<el-table-column prop="remarks" label="备注" min-width="80"  show-overflow-tooltip />
				<el-table-column type="expand">
					<template #default="props">
						<el-form label-position="left"  inline class="demo-table-expand">
							<el-form-item label="历史值" prop="oldValue">
								{{props.row.oldValue}}
							</el-form-item>
							<el-form-item label="新值" prop="newValue">
								{{props.row.newValue}}
							</el-form-item>
							<el-form-item label="对象主键编号" prop="taskId">
								{{props.row.taskId}}
							</el-form-item>
							<el-form-item label="请求编号，用于跟踪日志" prop="reqNo">
								{{props.row.reqNo}}
							</el-form-item>
							<el-form-item label="机构编号" prop="branchId">
								{{props.row.branchId}}
							</el-form-item>
							<el-form-item label="ip地址" prop="ip">
								{{props.row.ip}}
							</el-form-item>
						</el-form>
					</template>
				</el-table-column>
			</el-table> 
		<el-pagination  layout="total, sizes, prev, pager, next" @current-change="handleCurrentChange" @size-change="handleSizeChange" :page-sizes="[10,20, 50, 100, 500]" :current-page="pageInfo.pageNum" :page-size="pageInfo.pageSize"  :total="pageInfo.total" style="float:right;" />
	
</template>

<script>
	import util from '@/components/mdp-ui/js/util';//全局公共库 

	import { listXmRecord, delXmRecord, batchDelXmRecord } from '@/api/xm/core/xmRecord';
	import { mapState } from 'pinia'
import { useUserStore } from '@/store/modules/user'
import { MdpTableMixin } from '@/components/mdp-ui/mixin/MdpTableMixin.js';

	export default {
		mixins:[MdpTableMixin],
		computed: {
		    ...mapState(useUserStore,[
		      'userInfo','roles'
		    ])
		},
		props:["projectId",'productId',"objType","bizId","simple" ,"visible"],
		watch:{ 
			bizId:function(bizId){
				this.searchTableDatas();
			}
		},
		data() {
			return {
				currOpType: 'select',
				filters: {
					key: '',
					objType:'',
				}, 
				pageInfo:{//分页数据
					total:0,//服务器端收到0时，会自动计算总记录数，如果上传>0的不自动计算。
					pageSize:10,//每页数据
					count:true,//是否需要重新计算总记录数
					pageNum:1,//当前页码、从1开始计算
					orderFields:["oper_time"],//排序列 如 ['sex','student_id']，必须为数据库字段
					orderDirs:["desc"]//升序 asc,降序desc 如 性别 升序、学生编号降序 ['asc','desc']
				},
  
				addFormVisible: false,//新增xmRecord界面是否显示
				//新增xmRecord界面初始化数据
				addForm: {
					id:'',projectId:'',operUserid:'',operUsername:'',operTime:'',objType:'',action:'',oldValue:'',newValue:'',remarks:'',taskId:'',reqNo:'',branchId:'',ip:''
				},

				editFormVisible: false,//编辑界面是否显示
				//编辑xmRecord界面初始化数据
				editForm: {
					id:'',projectId:'',operUserid:'',operUsername:'',operTime:'',objType:'',action:'',oldValue:'',newValue:'',remarks:'',taskId:'',reqNo:'',branchId:'',ip:''
				}, 
				apis:{
					list: listXmRecord,
					del: delXmRecord,
					batchDel: batchDelXmRecord
				}
			}
		},//end data
		methods: {
			 
			//获取列表 XmRecord xm_record
			preQueryParamCheck( params ) {
				 
				if(this.projectId){
					params.projectId=this.projectId;
				}
				if(this.productId){
					params.productId=this.productId;
				}
				if(this.bizId){
					params.bizId=this.bizId;
				}
			 return  true;
			},
  

		},//end methods
		components: {

		    //在下面添加其它组件
		},
		mounted() { 
			this.filters.objType=this.objType
		}
	}

</script>

<style scoped />
